<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>密码修改</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <style>
        .password-requirements {
            font-size: 0.875rem;
            color: #6c757d;
            margin-top: 0.5rem;
        }
    </style>
</head>
<body>
<div class="container py-5">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2 class="mb-0">密码修改</h2>
    </div>

    <div class="card">
        <div class="card-body">
            <form id="changePasswordForm">
                <div class="mb-3">
                    <label for="currentPassword" class="form-label">当前密码</label>
                    <input type="password" class="form-control" id="currentPassword" required>
                </div>
                <div class="mb-3">
                    <label for="newPassword" class="form-label">新密码</label>
                    <input type="password" class="form-control" id="newPassword" required>
                </div>
                <div class="mb-3">
                    <label for="confirmPassword" class="form-label">确认新密码</label>
                    <input type="password" class="form-control" id="confirmPassword" required>
                </div>
                <button type="submit" class="btn btn-primary">修改密码</button>
            </form>
        </div>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
    $(document).ready(function() {
        // 获取当前用户ID（这里假设从某个地方获取，比如localStorage或sessionStorage）
        const userId = localStorage.getItem('userId') || 4; // 默认使用ID 4，实际应该从登录信息中获取

        $('#changePasswordForm').on('submit', function(e) {
            e.preventDefault();
            
            const currentPassword = $('#currentPassword').val();
            const newPassword = $('#newPassword').val();
            const confirmPassword = $('#confirmPassword').val();

            // 验证密码是否匹配
            if (newPassword !== confirmPassword) {
                alert('两次输入的新密码不匹配');
                return;
            }

            // 发送修改密码请求
            $.ajax({
                url: 'http://localhost:8082/api/user/password',
                method: 'PUT',
                contentType: 'application/json',
                data: JSON.stringify({
                    userId: userId,
                    currentPassword: currentPassword,
                    newPassword: newPassword
                }),
                success: function(response) {
                    if (response.code === 200) {
                        alert('密码修改成功');
                        // 清空表单
                        $('#changePasswordForm')[0].reset();
                    } else {
                        alert('密码修改失败：' + response.msg);
                    }
                },
                error: function(xhr, status, error) {
                    alert('密码修改失败：' + error);
                }
            });
        });
    });
</script>
</body>
</html> 